.sheets-nested-form, .sheets-nested-form:hover {
    background-color: var(--primary-color-strong) !important;
    border-color: var(--primary-color-strong) !important;
}

#sheets_form_builder .loader-modal {
    background-color: var(--gray-scale-1);
}

#sheets_form_builder .loader-modal .loader-modal-spinner {
    background-color: var(--primary-color-light) !important;
}

#sheets_form_builder .form-border{
    padding-left: 20px;
    padding-right: 20px;
    background-color: transparent;
    border: none;
    box-shadow: none;
}

#sheets_form_builder ul#progress li.progress-number:not(.active):before {
    color: var(--primary-color-strong);
    background: var(--gray-scale-3) !important;
    border-color: var(--gray-scale-3) !important;
}

#sheets_form_builder ul#progress li.progress-number:before {
    border: solid 1px var(--primary-color-light) !important;
    background: var(--primary-color-light) !important;
}

#sheets_form_builder ul#progress li.progress-number:after {
    background: var(--primary-color-light) !important;
    height: 2px !important;
}

#sheets_form_builder ul#progress li.progress-number:first-child:after {
    left: 90px;
}

#sheets_form_builder ul#progress li.progress-number:last-child:after {
    left: -80px;
}

#sheets_form_builder div.wrapper div.number:not(.active) {
    color: var(--primary-color-light);
    border: solid 2px var(--primary-color-light) !important;
    background: var(--gray-scale-1) !important;
}

#sheets_form_builder div.wrapper div.number {
    color: var(--gray-scale-1);
    border: solid 2px var(--primary-color-light) !important;
    background: var(--gray-scale-3) !important;
}

#sheets_form_builder div.wrapper div.step div.info p.title {
    color: var(--secondary-gray-900-color) !important;
    font-size: 14px;
}

#sheets_form_builder div.wrapper div.step:after {
    background: var(--primary-color-light) !important;
}

#sheets_form_builder div.wrapper div.active {
    background: var(--primary-color-light) !important;
}

#sheets_form_builder .btn.btn-secondary {
    /*color: var(--primary-color-strong) !important;*/
    /*background-color: var(--primary-color-strong) !important;
    border-color: var(--primary-color-strong) !important;*/
    background-color: var(--primary-color-light) !important;
    border-color: var(--primary-color-light) !important;
    
}
#sheets_form_builder .btn.btn-secondary:disabled {
    color: var(--gray-scale-3) !important;
    background-color: var(--gray-scale-4) !important;
    border-color: var(--gray-scale-4) !important;
}

#sheets_form_builder .btn.btn-success {
    background-color: var(--primary-color-light) !important;
    border-color: var(--primary-color-light) !important;
}

#sheets_form_builder .btn.btn-success:disabled {
    color: var(--gray-scale-3) !important;
    background-color: var(--gray-scale-4) !important;
    border-color: var(--gray-scale-4) !important;
}

#sheets_form_builder .btn.btn-block.btn-secondary {
    background-color: var(--primary-color-light) !important;
    border-color: var(--primary-color-light) !important;
}

h3.sheets-row-title {
    font-size: 20px;
}

.close {
    float: right;
    font-size: 1.35rem;
    font-weight: 100;
    line-height: 1;
    color: var(--gray-scale-4);
    text-shadow: 0 1px 0 var(--gray-scale-1);
    opacity: 0.5;
}

.close:hover {
    color: #7F7E8E;
}


.sheets-form-title {
    color: var(--gray-scale-6);
    text-align: center;
    font-style: normal;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 20px !important;
}

.sheets-row-title {
    color: var(--primary-color-strong);
    font-style: normal;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    padding: 0px 5px !important;
}

.btn-primary {
    color: var(--gray-scale-1);
    background-color: var(--primary-color-strong);
    border-color: var(--primary-color-strong);
}

.custom-file-label {
    border-radius: var(--border-radius) !important;
    border: 1px solid var(--input-label-color) !important;
    background: var(--input-label-color) !important;
}

.custom-file-label::after {
    font-family: "Font Awesome 5 Free";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: block;
    height: calc(1.5em + 0.75rem);
    padding: 0.375rem 0.75rem;
    line-height: 1.5;
    color: var(--primary-color-strong) !important;
    content: "\f0fe";
    background: var(--input-label-color) !important;
    border-left: none !important;
    border-radius: 0 0.25rem 0.25rem 0;
}

input:focus + label {
    outline: 1px solid var(--gray-scale-4) !important;
}

input[type=checkbox] {
    accent-color: var(--primary-color-strong) !important;
}
